const path = require('path')
//const webpack = require('webpack')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const VueLoaderPlugin = require('vue-loader/lib/plugin')

module.exports = {
    entry: {
       main: './src/main.js'
    },
    output: {
        filename: 'bundle.js',
        path: path.join(__dirname, 'dist'),
    },
    
    // optimization: {
    //     splitChunks: {
    //       chunks: 'all'
    //    }
    // },  
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/preset-env']
                    }
                }
            },
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: 'eslint-loader',
                enforce: 'pre'                   
            }, 
            {
                test: /\.css$/,
                use: [
                    'style-loader',
                    'css-loader'
                ]
            },           
            {
                test: /\.less$/,
                use: [
                    'vue-style-loader',
                    'css-loader',
                    'less-loader'
                ]
            },
            {
                test: /\.png$/,
                use: {
                    // loader: 'file-loader',
                    // options:{
                    //     name: '[name]-[hash:8].[ext]',
                    // }
                    loader: 'url-loader',
                    options: {
                        limit: 10 * 1024,
                        esModule: false
                    }
                }
            },
            {
                test: /\.vue$/,
                use: {
                    loader: 'vue-loader'
                }
            },
            // {
            //     test: /\.html$/,
            //     use: {                   
            //         loader: 'html-loader',
            //         options : {
            //             attributes: {
            //                 list:[
            //                     {
            //                         tag: 'link',
            //                         attribute: 'href',
            //                         type: 'src'
            //                     }                                
            //                 ]}
            //             //attrs: ['img:src', 'link:href']
            //           }
            //     }                    
            // }
        ]
    },
    plugins: [
        new VueLoaderPlugin(),
        new HtmlWebpackPlugin({            
            template:'./public/index.html',
            title: 'Webpack Vue Project Sample',
            filename: 'index.html'
        }),
        // new webpack.DefinePlugin({
        //     'process.env': [
        //         {
        //             NODE_ENV: '"development"',
        //             BASE_URL: JSON.stringify('./')
        //         },
        //         {
        //             NODE_ENV: '"production"',
        //             BASE_URL: JSON.stringify('./dist/')
        //         }
        //     ]
        // })       
    ],
    resolve: {
        alias:{
            'vue$': 'vue/dist/vue.js',
            '@': path.resolve(__dirname, './src'),
        }        
    }
}